.pg-toast-wrapper {
  position: fixed;
  z-index: $z-index-toast;
  left: 50%;
  top: 0;
  bottom: auto;
  transform: translate(-50%);

  display: flex !important;
  align-items: center;
  flex-direction: column;

  overflow: hidden;
  padding: 0 20px 20px;
  pointer-events: none;

}

.pg-toast {
  display: flex;
  align-items: center;
  position: relative !important;
  margin: 10px 0 0;
  padding: 0 5px 0 15px;
  pointer-events: all;
  outline: none;
  min-width: 77px;

  background-color: $white;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2);
  font-size: $font-size-base;
  height: 35px;
  line-height: 35px;
  overflow: hidden;
  word-break: break-all;
  word-wrap: break-word;
  font-weight: 500;

  .content {
    flex: 1 1 auto;
    padding: 11px;
    word-break: break-word;
  }

  [class*=" icon-"],
  [class^="icon-"] {
    font-size: 20px;

    &.icon-cancel-circle2 {
      font-size: 14px;
      cursor: pointer;
      margin-left: 5px;
      margin-right: 5px;
      margin-top: 2px;
      color: $secondary;
      transition: color .3s ease-in-out;

      &:hover {
        color: #666;
      }
    }
  }


  //&.primary {
  //  color: $primary;
  //}
  //
  //&.success {
  //  color: $success;
  //}
  //
  //&.warning {
  //  color: $warning;
  //}
  //
  //&.danger {
  //  color: $danger;
  //}

}
